import React, {useRef, useCallback} from 'react';
import {Dialog} from '@alifd/next';
import {DialogProps} from '@alifd/next/types/dialog';
import {request} from 'ice';
import Operation, {ActionType, OperaitionProps, OperationRef} from './Operation';

const getDialogTitle = (actionType: ActionType): string => {
  switch (actionType) {
    case 'add':
    default:
      return '添加公告';

    case 'edit':
      return '编辑';

    case 'preview':
      return '预览员工';
  }
};

const DialogOperation: React.FC<OperaitionProps & DialogProps> = (props) => {
  const {
    actionType, dataSource, onOk = () => {
    }, ...lastProps
  } = props;
  const operationRef = useRef<OperationRef>(null);

  const handleOk = useCallback(() => {
    if (actionType === 'preview') {
      return onOk(null);
    }
    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
    // @ts-ignore
    operationRef.current.getValues(async (values) => {
      let newVar = await request({
        url: 'v1/admin/movie/mvm/',
        method: 'post',
        data: values
      });
      if (newVar.statusCode && newVar.statusCode === 200) {
        onOk(values);
      }
    });
  }, [actionType, onOk]);

  // const handleCalcle = useCallback(() => {
  //   if (actionType === 'preview') {
  //     return onCancel(null);
  //   }

  // }, [actionType, onCancel])

  return (
    <Dialog
      shouldUpdatePosition
      isFullScreen
      title={getDialogTitle(actionType)}
      style={{width: 600}}
      footerAlign="center"
      {...lastProps}
      onOk={handleOk}
      // onCancel={handleCalcle}
    >
      <Operation ref={operationRef} actionType={actionType} dataSource={dataSource}/>
    </Dialog>
  );
}

export default DialogOperation;
